import { Button, message } from 'antd';
import { WeaDialog, WeaSearchGroup, WeaFormItem, WeaLocaleProvider } from 'ecCom';
import { WeaSwitch } from 'comsMobx';
import { observer } from 'mobx-react';
import { toJS } from 'mobx';
import '../../../style/index';

const getLabel = WeaLocaleProvider.getLabel;
@observer
class AddCarUseWorkflowDialog extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      visible: false,
      id: 0,
    };
  }

  componentDidMount() {
    // const { currentStore } = this.props;
    // currentStore.getAddUseCarWorkflowSetInitData(this.state.id);
  }

  render() {
    const { currentStore } = this.props;
    const { addconditioninfo, form, addDialogVisible } = currentStore;
    let buttonElement = [];


    buttonElement = [<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@hj7f6v@onSubmit`} type="primary" onClick={this.onSubmit}>{getLabel(86, '保存')}</Button>,
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@5jucl8@onSubmitToDetails`} type="primary" onClick={this.onSubmitToDetails}>{getLabel(32159, '保存并进入详细设置')}</Button>,
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@3gdsqz@back`} type="primary" onClick={this.back}>{getLabel(309, '关闭')}</Button>];

    return (
      <div>
        <WeaDialog
          ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@3uzwtz`}
          className="car"
          title={getLabel(385831, '添加用车申请表单设置')}
          visible={addDialogVisible}
          onCancel={this.back}
          buttons={buttonElement}
        >
          {
            this.getHTML()
          }

        </WeaDialog>
      </div>
    );
  }

  // 添加车辆
  getHTML = () => {
    const { currentStore } = this.props;
    const { addconditioninfo, addform, workflowData } = currentStore;
    const { formid } = workflowData;
    let formidSpan = '';
    if (formid) {
      formidSpan = formid.valueSpan;
    }
    const { isFormInit } = addform;
    const group = [];

    isFormInit && addconditioninfo.map((c, index) => {
      const items = [];
      c.items.map((fields) => {
        items.push({
          com: (<WeaFormItem
            ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@30k4wh@${fields.domkey[0]}`}
            label={`${fields.label}`}
            labelCol={{ span: `${fields.labelcol}` }}
            error={addform.getError(fields)}
            wrapperCol={{ span: `${fields.fieldcol}` }}
          >
            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@426mwm@${fields.domkey[0]}`} key={new Date().getTime()} fieldConfig={toJS(fields)} form={addform} onChange={(v) => { fields.domkey[0] == 'workflowid' && this.workflowidChange(v); }} />
          </WeaFormItem>),
          colSpan: 1,
          hide: fields.hide == 1,
        });
      });
      group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@5l5dg9@${index}`} col={1} needTigger={false} title={c.title} showGroup={c.defaultshow} items={items} />);
    });
    return group;
  }

  // 打开Dialg
  open = (results) => {
    this.setState({
      // visible: true,
      id: results.id,
    });
    const { currentStore } = this.props;
    currentStore.addDialogVisible = true;
    currentStore.getAddUseCarWorkflowSetInitData(results.id);
  }
  // 隐藏关闭Dialg
  back = () => {
    const { currentStore } = this.props;
    currentStore.addDialogVisible = false;
    this.setState({
      visible: false,
    });
  }
  // 流程浏览框选择时判断
  workflowidChange = (obj) => {
    const { currentStore } = this.props;
    if (obj) {
      if (obj.workflowid.value == '') {
        const obj1 = {};
        obj1.formid = { value: '', valueSpan: '', valueObj: [] };
        obj1.typeid = { value: '', valueSpan: '', valueObj: [] };
        obj1.workflowid = { value: '', valueSpan: '', valueObj: [] };
        currentStore.addform.updateFields(obj1);
      } else {
        currentStore.workflowidChange({ workflowid: obj.workflowid.value, operation: 'getForminfo' }, this.fourceUpdate);
      }
    }
  }

  fourceUpdate = (data) => {
    const { currentStore } = this.props;
    const { addconditioninfo, addform, workflowData } = currentStore;
    addform.updateFields(workflowData);
  }

  // 添加车辆时保存
  onSubmit = () => {
    this.onCommonSubmit({ operation: 'add' });
  }
  // 添加车辆时保存并进入明细设置
  onSubmitToDetails = () => {
    this.onCommonSubmit({ operation: 'createToDetails2' });
  }
  // 提交公用方法
  onCommonSubmit = (results) => {
    const { currentStore, parentStore } = this.props;
    currentStore.addform.validateForm().then((f) => {
      if (f.isValid) {
        if (currentStore.addform.$('workflowid').value == '') {
          message.error(getLabel(127158, '请选择流程！'));
          return;
        }
        currentStore.operation = results.operation;
        currentStore.doSubmitByAdd({ aa: '' }, this.onSubmitCallBack);
      } else {
        f.showErrors();
      }
    });
  }

  clearForm = () => {
    currentStore.addform.$('workflowname').value = '';
  }

  onSubmitCallBack = () => {
    this.setState({
      visible: false,
    });
    const { currentStore, parentStore } = this.props;
    parentStore.doTableLoading();
  }
}
export default AddCarUseWorkflowDialog;
